export default function useEchartMapOption(mapName) {
  const compId = mapName;

  function getOption(setting) {
    const { zoom, roam, data } = setting;
    // const option = {
    //   backgroundColor: "rgba(15, 20, 27, 1)",
    //   geo: [
    //     {
    //       show: false,
    //       map: compId,
    //     },
    //   ],
    //   series: [
    //     //地图
    //     {
    //       name: "名称",
    //       type: "map",
    //       mapType: compId,
    //       zoom, //默认显示级别
    //       roam,
    //       itemStyle: {
    //         normal: {
    //           areaColor: "#003669",
    //           borderColor: "#3fdaff",
    //           borderWidth: 2,
    //           shadowColor: "rgba(63, 218, 255,0.6)",
    //           shadowBlur: 35,
    //         },
    //       },
    //       data,
    //     },
    //   ],
    // };
    let option = {
      tooltip: {
        trigger: "item",
        borderWidth: 0, // 取消边框
        borderColor: "transparent", // 设置边框颜色为透明
        background: "transparent",
        extraCssText:
          "background: transparent !important; color: transparent !important;box-shadow:none;",
        position(point, params, dom, rect, size) {
          return [point[0] - size.contentSize[0] / 2, point[1] + 10];
        },
        // // 使用 formatter 自定义 tooltip 内容
        formatter: function (params) {
          console.log("params", params);
          const mapInfo = params.data
          const tooltipHtml = `<div style="width: 100%; height: 100%; background: red !important; color: #fff !important;">
          ${mapInfo.name}-${mapInfo.value}
      </div>`;
          return tooltipHtml;
        },
        // padding: 8,
        // enterable: true,
        // transitionDuration: 1,
        // textStyle: {
        //   color: "#fff",
        //   decoration: "none",
        // },
      },
      series: [
        {
          type: "map",
          mapType: "china",
          label: {
            normal: {
              show: true,
              textStyle: {
                color: "#fff",
                fontSize: 12,
              },
            },
          },
          data: [
            { name: "北京市", value: 200 },
            { name: "天津市", value: 200 },
          ],
        },
      ],
    };
    return option;
  }

  return {
    getOption,
  };
}
